<template>
    <vue-monaco-editor
      v-model:value="code"
      theme="vs-dark"
      :options="MONACO_EDITOR_OPTIONS"
      @mount="handleMount"
    />
  </template>
  
  <script lang="ts" setup>
  import { ref, shallowRef } from 'vue'
  
  const MONACO_EDITOR_OPTIONS = {
    automaticLayout: true,
    formatOnType: true,
    formatOnPaste: true,
  }
  
  const code = ref('// 请开始你的表演...')
  const editor = shallowRef()
  const handleMount = editorInstance => (editor.value = editorInstance)
  
  // your action
  function formatCode() {
    editor.value?.getAction('editor.action.formatDocument').run()
  }
  </script>